<template>
  <div>
    <a-card class="card" :bordered="false" :style="`min-height: ${cardMinHeight}px;`">

      <!--弹窗0 新增按钮-->
      <a-modal
          destroyOnClose
          class="addModal"
          v-model='addModal'
          width='800px'
          :title="isAdd?'新增':title"
          @ok="submit"
          @cancel="handleCancel0"
          :bodyStyle="bodyStyle"
      >
        <a-spin :spinning="spinning">
          <div style="width: 100%;min-height: 30px;display: flex;flex-direction: row;padding: 10px 24px 10px 24px;justify-content: space-between">
            <div style="width: 100%;">
              <a-form-model :model="addPlanForm"  layout="inline">

                <a-form-model-item label="点检人" >
                  <a-popover  trigger="click" placement="bottom" :overlayStyle="{ width: '250px' }">
                    <template slot="content">
                      <p class="aPopover" v-for="(item,index) in userSearchList" :key="index"  @click="changeUser(item)" >{{item.name}}</p>
                    </template>
                    <a-input style='width: 250px;height: 32px;'
                             v-model.trim="addPlanForm.order_user"
                             @keydown.enter="getUserList(addPlanForm.order_user)"
                             @change="getUserList(addPlanForm.order_user)"
                             @click="getUserList(addPlanForm.order_user)"
                             allowClear
                             placeholder="选择点检人"
                             v-auth="`query`" ></a-input>
                  </a-popover>
                </a-form-model-item>

                <a-form-model-item
                    label="日期"
                    style="width: 100%"
                >
                  <a-range-picker
                      :valueFormat="'YYYY-MM-DD'"
                      :format="'YYYY-MM-DD'"
                      v-model.trim="addPlanForm.dateSelect"
                      :allow-clear="true"
                      style="margin-left: 14px"/>
                </a-form-model-item>

                <a-form-model-item
                    label="点检周期">
                  <a-radio-group v-model="addPlanForm.valueRadio"
                  style="margin: 10px" allowClear>
                    <a-radio :value="1" style="width: 90%">
                      每天
                    </a-radio>
                    <a-radio :value="2" style="width: 90%">
                      每周周<a-input style="width: 100px;margin: 0 10px" placeholder="数字1-7" v-model.trim="addPlanForm.weekValue"/>
                    </a-radio>
                    <a-radio :value="3">
                      每月<a-input style="width: 100px;margin: 10px 10px" placeholder="数字1-31" v-model.trim="addPlanForm.monthValue"/>日
                    </a-radio>
                  </a-radio-group>
                </a-form-model-item>

                <div style="display: flex;justify-content: space-between;margin-bottom: 10px;">
                  <a-input style='width: 125px;height: 32px;' v-model.trim="addDeviceForm.device_id" placeholder="*序号" disabled></a-input>

                  <a-popover trigger="click" placement="bottom" :overlayStyle="{ width: '125px' }">
                    <template slot="content">
                      <p class="aPopover" v-for="(item,index) in deviceSearchList" :key="index"  @click="changeDevice(item)" >{{
                          'code:'+item.code+',name:'+item.name}}</p>
                    </template>
                    <a-input style='width: 125px;height: 32px;'
                             v-model.trim="addDeviceForm.device_code"
                             placeholder="*编码(搜索)"
                             allowClear
                             @keydown.enter="getDeviceListByDeviceCode(addDeviceForm.device_code)"
                             @change="getDeviceListByDeviceCode(addDeviceForm.device_code)"
                             @click="getDeviceListByDeviceCode(addDeviceForm.device_code)"
                             :disabled="!canBeEdited || !isAdd"></a-input>
                  </a-popover>

                  <a-popover trigger="click" placement="bottom" :overlayStyle="{ width: '125px' }">
                    <template slot="content">
                      <p class="aPopover" v-for="(item,index) in deviceSearchList" :key="index"  @click="changeDevice(item)" >{{
                          'code:'+item.code+',name:'+item.name}}</p>
                    </template>
                    <a-input style='width: 125px;height: 32px;'
                             v-model.trim="addDeviceForm.device_name" placeholder="*名称(搜索)"
                             @keydown.enter="getDeviceListByDeviceName(addDeviceForm.device_name)"
                             @change="getDeviceListByDeviceName(addDeviceForm.device_name)"
                             allowClear
                             @click="getDeviceListByDeviceName(addDeviceForm.device_name)"
                             :disabled="!canBeEdited || !isAdd"></a-input>
                  </a-popover>

                  <a-input style='width: 125px;height: 32px;' v-model.trim="addDeviceForm.specification"  placeholder="规格"  disabled></a-input>
                  <div style='width: 125px;display: flex;  justify-content:right;margin-left: 10px' >
                    <a-button type="primary" style="margin-right: 15px" @click="clearAddMessage" :disabled="!canBeEdited || !isAdd">重置</a-button>
                    <a-button type="primary" @click="addDevice" :disabled="!canBeEdited || !isAdd || !this.addDeviceForm.device_id">添加</a-button>
                  </div>
                </div>
                <a-table
                    :columns="addColumns"
                    :data-source="addPlanForm.subDevices"
                    :pagination="addPagination"
                    @change="onChangeAdd"
                    :showPagination="true"
                    :rowKey="(record1) => {return record1.id}"
                    :scroll="{x:true,y: 165 }"
                >
                  <template slot="action" slot-scope="record1">
                    <a-popconfirm title="确定删除?" @confirm="delSubDevice(record1)">
                      <a>删除</a>
                    </a-popconfirm>
                  </template>
                </a-table>
              </a-form-model>

            </div>
          </div>
        </a-spin>

      </a-modal>

      <page-head-area>
        <div class="extra" style="width: 260px;display: flex;justify-content: space-around">
<!--          <a-badge count="9">-->
            <a-button icon="plus-circle" v-auth="`insert`" @click="add" style="background-color: #fff;border: none;margin-left: 10px;width: 70px;height: 35px;">新增</a-button>
<!--          </a-badge>-->
          <a-popconfirm title="批量删除?" @confirm="deleteSelect">
            <a-button icon="delete" v-auth="`delete`" style="background-color: #fff;border: none;margin-left: 10px;width: 70px;height: 35px;">删除</a-button>
          </a-popconfirm>
          <a-button icon="audit"  style="background-color: #fff;border: none;margin-left: 10px;width: 70px;height: 35px;">审核</a-button>
        </div>
      </page-head-area>

      <div class="queryBox">
        <a-form-model layout="inline" :model='queryForm' class='query' style='display: flex;flex-wrap: wrap;'>
          <a-form-model-item
              label="审核状态"
          >
            <a-select
                style='width: 150px'
                allowClear
                v-model.trim='queryForm.plan_status'
                v-auth="`query`"
            >
              <a-select-option
                  v-for='item in planStatusList'
                  :key='item.code'
                  :value='item.code'
              >{{item.description}}</a-select-option>
            </a-select>
          </a-form-model-item>

          <a-form-model-item
              label="日期范围"
          >
            <a-range-picker
                :valueFormat="'YYYY-MM-DD'"
                style="width: 300px;"
                :format="'YYYY-MM-DD'"
                v-model.trim="queryForm.dateSelect"
                :allow-clear="true"/>
          </a-form-model-item>

          <a-form-model-item>
            <a-button type='primary' style='height: 32px;width: 70px;text-align: center' @click="reset" v-auth="`query`">
              重置
            </a-button>
          </a-form-model-item>
          <a-form-model-item>
            <a-button type='primary' style='height: 32px;width: 70px;text-align: center' @click="filter" v-auth="`query`">
              搜索
            </a-button>
          </a-form-model-item>
        </a-form-model>
      </div>
      <div class="dataBox">
        <a-table
            :columns="columns"
            :data-source="data"
            :pagination="false"
            :loading="tableLoading"
            :rowKey="(recordMain) => {return recordMain.id}"
            :scroll="{ x: 1000, y: 500 }"
            :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
        >
          <template slot="action" slot-scope="record">
              <a v-auth="`query`">详情</a>
              <a-divider type="vertical"/>
            <a-popconfirm title="确定删除?" @confirm="delOnePlan(record.id)">
              <a v-auth="`update`">删除</a>
            </a-popconfirm>


          </template>
        </a-table>

      </div>

      <a-pagination
          @change="onChangePage"
          @showSizeChange="showSizeChange"
          :total="pagination.total"
          :showSizeChanger="true"
          :showQuickJumper="true"
          :defaultPageSize="pagination.defaultPageSize"
          :pageSize="pagination.page_size"
          :pageSizeOptions="pagination.pageSizeOptions"
          :current="pagination.current"
          :showTotal="pagination.showTotal"
          style="width: 100%;display: flex;flex-direction: row;justify-content: flex-end;margin-top: 15px"
      ></a-pagination>
    </a-card>
  </div>
</template>

<script>

import {mapGetters} from "vuex";
import PageHeadArea from "../module/pageHeadArea.vue";
import pagination from "ant-design-vue/lib/pagination";
import storage from "store";
import {DEPT_ID, ORGANIZATION_ID, USER_TOKEN} from "@/store/mutation-types";
import axios from "axios";
import moment from "moment";
import {
  file_import, file_upload,
  get_employee_list,
  get_extended_define, get_asset_file_list, get_supplier, get_unit_list, download_file,
  get_organization_list,
  delete_asset, get_asset_list, save_asset, update_asset,
  get_category_type_list, get_organization_profile_list, get_template_list, update_extend
} from "@/services/manage";
import {
  deleteDeviceInspectionPlan,
  deleteDeviceRepair, getCacheByVaguename,
  getDeviceList, getUserNameById,
  listDeviceInspectionPlan, listSpareParts, saveDeviceInspectionPlan
} from "../../utils/interface";
import {message} from "ant-design-vue";
import {list_device_inspection_plan} from "../../services/inspection";
const data = []

const addData =[]

const columns = [
  { title: '设备编码', width: 120, align:'center',dataIndex: 'device_code', key: 'device_code'},
  { title: '设备名称', width: 120, align:'center',dataIndex: 'device_name', key: 'device_name'},
  { title: '点检日期', width: 120, align:'center',dataIndex: 'inspection_time', key: 'inspection_time'},
  { title: '点检日负责人', width: 120, align:'center',dataIndex: 'user_in_charge_name', key: 'user_in_charge_name'},
  { title: '状态', width: 120, align:'center',dataIndex: 'status_name', key: 'status_name'},
  {
    title: '操作',
    align:'center',
    key: 'operation',
    fixed: 'right',
    width: 180,
    scopedSlots: { customRender: 'action' }
  }
]

const addColumns = [

  { title: '序号', width: 120, align:'center',dataIndex: 'device_id', key: 'device_id'},
  { title: '编码', width: 120, align:'center',dataIndex: 'device_code', key: 'device_code'},
  { title: '名称', width: 120, align:'center',dataIndex: 'device_name', key: 'device_name'},
  { title: '规格', width: 120, align:'center',dataIndex: 'specification', key: 'specification'},
  {
    title: '操作',
    align:'center',
    key: 'operation',
    fixed: 'right',
    width: 180,
    scopedSlots: { customRender: 'action' }
  }
]

export default {
  name: "userAuthority",
  components: {PageHeadArea},
  data() {
    return {
      userSearchList:[],
      deviceSearchList:[],
      addDeviceForm:{
        device_id:undefined,
        device_code:undefined,
        device_name:undefined,
        specification:undefined
      },
      addPlanForm:{
        dateSelect:[],
        order_user:undefined,
        order_user_id:undefined,
        valueRadio:undefined,
        weekValue:undefined,
        monthValue:undefined,
        subDevices:[]
      },
      selectedRowKeys:[],
      planStatusList:[
        {code:null,description: '不限'},
        { code: 0, description: "未完成" },
        { code: 1, description: "已完成" }],
      addColumns,
      addData,
      monthText:null,
      weekText:null,
      valueRadio:null,
      tableLoading01: false,
      axiosSource: null,
      tabKey: '1',
      title:'',
      tabBarGutter: 0,
      tabBarStyle: {
        color: 'rgba(0, 0, 0, 0.85)'
      },
      bodyStyle: {
        'padding': '0px 24px 0px 24px',
        'font-size': '14px',
        'line-height': '1.5',
        'word-wrap': 'break-word',
      },
      cardMinHeight: 0,
      queryForm: {
        plan_status:undefined,
        dateSelect:[],
      },
      statusList: [
        // {id: 1, name: '待采购', code: '0', type: 'use_status'},
        {id: 1, name: '正常运行', code: '1',type: 'use_status'},
        {id: 2, name: '不正常运行', code: '2',type: 'use_status'},
      ],
      data,
      columns,
      pagination: {
        total: 0,
        page_size: 10,
        defaultPageSize: 10,
        page: 1,
        current: 1,
        showSizeChanger: true,
        showQuickJumper: true,
        showTotal: total => `共 ${total} 条记录`,
        pageSizeOptions: ['10', '20', '50', '100', '500'],
      },
      tableLoading: false,
      addModal: false,
      canBeEdited: false, //是否可编辑
      isAdd: false, //是否为新增
      spinning: false,

      detailModal:false, //详情弹窗
      canBeQuery:false, //是否可查询

      maintenance_detailsModal:false,
      key1Pagination: {
        total: 0,
        page_size: 4,
        defaultPageSize: 4,
        page: 1,
        current: 1,
        showSizeChanger: true,
        showQuickJumper: true,
        showTotal: total => `共 ${total} 条记录`,
        pageSizeOptions: ['4', '8', '10', '20', '50'],
      },
      addPagination:{
        total: 0,
        page_size: 4,
        defaultPageSize: 4,
        page: 1,
        current: 1,
        showSizeChanger: true,
        showQuickJumper: true,
        showTotal: total => `共 ${total} 条记录`,
        pageSizeOptions: ['4', '8', '10', '20', '50'],
      }
    }
  },
  watch: {},
  authorize: {
    add: 'insert',
    getAssetLedgerList: 'query',
    reset: 'query',
    query: 'query',
    detail: 'query',
    edit: 'update',
    del: 'delete',
    check: 'check',
  },
  computed: {
    ...mapGetters(['getCardMinHeight']),
  },
  created() {
    this.cardMinHeight = this.getCardMinHeight
  },
  async mounted() {
    this.axiosSource = axios.CancelToken.source();

    await this.initialize()

  },
  methods: {
    async getUserList(order_user) {
      this.userSearchList = []
      await getCacheByVaguename(order_user).then(res=>{
        res.slice(0, 10).forEach(item => {
          this.userSearchList.push({
            id: item.id,
            name: item.name
          })
        })
      })
      // console.log(this.userSearchList)
    },
    delSubDevice(record1){
      this.addPlanForm.subDevices = this.addPlanForm.subDevices.filter(item => item.device_id !== record1.device_id)
    },
    clearAddMessage(){
          this.deviceSearchList=[]
          this.addDeviceForm={
            device_id:undefined,
            device_code:undefined,
            device_name:undefined,
            specification:undefined
            }
    },
    addDevice(){
      if(this.addDeviceForm.device_id){
        if(this.addPlanForm.subDevices.some(item=>item.device_id===this.addDeviceForm.device_id)){
          message.error('设备已存在')
          return
        }
      }
      this.addPlanForm.subDevices.push({
        'device_id':this.addDeviceForm.device_id,
        'device_code':this.addDeviceForm.device_code,
        'device_name':this.addDeviceForm.device_name,
        'specification':this.addDeviceForm.specification
      })
      this.clearAddMessage()
    },
    onSelectChange(selectedRowKeys){
      // console.log('selectedRowKeys changed: ', selectedRowKeys);
      this.selectedRowKeys = selectedRowKeys
    },
    changeUser(item){
      this.addPlanForm.order_user=item.name;
      this.addPlanForm.order_user_id= item.id
      // console.log(record1)
      this.userSearchList=[]
    },
    async filter() {
      //筛选
      this.pagination.page = 1
      this.pagination.current = 1
      this.pagination.page_size = 10
      this.tableLoading = true
      await this.initialize({
        'status':this.queryForm.plan_status
      })
      this.tableLoading = false;
    },
    async getDeviceListByDeviceCode(code) {
      await getDeviceList({'code': code}).then(res => {
        this.deviceSearchList = []
        res.slice(0, 10).forEach(item => {
          this.deviceSearchList.push({
            id: item.id,
            code: item.code,
            name: item.name,
            specification:item.specification
          })
        })
      })
    },
    async getDeviceListByDeviceName(name) {
      await getDeviceList({'name': name}).then(res => {
        this.deviceSearchList = []
        res.slice(0, 10).forEach(item => {
          this.deviceSearchList.push({
            id: item.id,
            code: item.code,
            name: item.name,
            specification:item.specification
          })
        })
      })
    },
    changeDevice(item){
      this.addDeviceForm={
        device_id:item.id,
        device_code:item.code,
        device_name:item.name,
        specification:item.specification
      }
      this.deviceSearchList =[]
    },
    onChangePage (page, pageSize) {
      this.pagination.current = page
      this.pagination.page_size = pageSize
      this.pagination.page = page
      this.initialize()
    },
    showSizeChange(current, size){
      this.pagination.page_size = size
      this.pagination.current = current
      this.pagination.page = current
      this.initialize()
    },
    async initialize(params){
      this.tableLoading =true
      this.data=[]
      const paramsAll = Object.assign({}, params, {
        "page": this.pagination.page,
        "page_size": this.pagination.page_size
      });

      await list_device_inspection_plan(paramsAll).then(async res => {
        if(res.data.code !== '1000'){
          this.tableLoading =false
          this.data=[]
        }else{
          this.pagination.total = res.data.extension.total+(this.pagination.current-1)*this.pagination.page_size
          for (const item of res.data.data) {
            let searchDevice = await getDeviceList({'id': item.device_id})
            console.log(searchDevice)
            item['device_code'] = searchDevice[0]?.code || ''
            item['device_name'] = searchDevice[0]?.name || ''
            item['status_name'] = this.planStatusList.find(it=>it.code===item.status)?.description || ''
            item['user_in_charge_name'] = await getUserNameById(item.user_in_charge)
          }
          //日期
          const [startDate, endDate] = this.queryForm.dateSelect;
          res.data.data = res.data.data.filter(itemRes => {
            return (
                (!startDate || new Date(itemRes.inspection_time) >= new Date(startDate)) &&
                (!endDate || new Date(itemRes.inspection_time) <= new Date(endDate))
            );
          });
          this.data=res.data.data
        }

      })
      this.tableLoading =false
    },
    // 分页切换
    onChange (pagination) {
      this.pagination.current = pagination.current
      this.pagination.page_size = pagination.pageSize
      this.pagination.page = pagination.current
      this.getAssetLedgerList()
    },
    // 分页切换
    onChangeKey1 (pagination) {
      this.key1Pagination.current = pagination.current
      this.key1Pagination.page_size = pagination.pageSize
      this.key1Pagination.page = pagination.current
    },
    onChangeAdd(pagination){
      this.addPagination.current = pagination.current
      this.addPagination.page_size = pagination.pageSize
      this.addPagination.page = pagination.current
    },
    async query() {
      this.tableLoading = true
      this.pagination.page = 1
      this.pagination.current = 0
      this.pagination.page_size = 10
      await this.initialize()
      this.tableLoading = false

    },
    reset() {
      this.queryForm = {
        plan_status:undefined,
        dateSelect:[],

      }
      this.query()
    },
    add() {
      this.clearParams()
      this.addModal = true
      this.canBeEdited = true
      this.isAdd = true
      this.spinning = false
      //清空
    },
    clearParams(){
      this.deviceSearchList=[]
      this.addDeviceForm={
        device_id:undefined,
            device_code:undefined,
            device_name:undefined,
            specification:undefined
      }
      this.addPlanForm={
            dateSelect:[],
            valueRadio:undefined,
            weekValue:undefined,
            monthValue:undefined,
            subDevices:[]
      }
    },
    edit(record) {
      this.addModal = true
      this.canBeEdited = true
      this.isAdd = false
      this.echo(record)
    },
    async deleteSelect() {
      for (const item of this.selectedRowKeys) {
        await deleteDeviceInspectionPlan({'id': item})
      }
      this.selectedRowKeys = []
      message.success('删除成功')
      await this.initialize()
    },
    async delOnePlan(id) {
      await deleteDeviceInspectionPlan({'id': id})
      message.success('删除成功')
      await this.initialize()
    },
    detail(record) {
      this.detailModal = true
      this.canBeEdited = false
      this.canBeQuery =true
      this.isAdd = false
      this.echo(record)
    },
    clearParameter() {},
    handleCancel() {
      this.tabKey = '1'
    },
    handleCancel0() {
      this.addModal = false
      this.clearParams()
      this.canBeEdited = false
      this.isAdd = false
    },
    generateUniqueCode() {
      // 使用当前时间戳和随机数生成唯一代码
      const timestamp = Date.now().toString();
      const randomNum = Math.floor(Math.random() * 10000).toString();
      return `ORD-${timestamp}-${randomNum}`;
    },
    async submit() {
      if(this.addPlanForm.order_user_id===undefined){
        message.error('请选择点检人')
        return
      }
      if(this.addPlanForm.valueRadio===undefined){
        message.error('请选择周期')
        return
      }
      if(this.addPlanForm.dateSelect.length===0){
        message.error('请选择时间')
        return

      }
      if (this.addPlanForm.subDevices.length === 0) {
        message.error('请选择设备')
        return
      }

        // 获取时间范围
        message.info("开始新增,请稍等")
        const [startDateStr, endDateStr] = this.addPlanForm.dateSelect
        const startDate = new Date(startDateStr);
        const endDate = new Date(endDateStr);
        let currentDate = new Date(startDate);
        let date_list = []
        if (this.addPlanForm.valueRadio === 1) {
          //每天
          while (currentDate <= endDate) {
            date_list.push(currentDate.toISOString().slice(0, 19).replace('T', ' '));
            currentDate.setDate(currentDate.getDate() + 1);
          }
        }
      if (this.addPlanForm.valueRadio === 2 && this.addPlanForm.weekValue===undefined) {
        message.error("请填写每周具体日期")
        return
      }
        if (this.addPlanForm.valueRadio === 2) {
          let week = this.addPlanForm.weekValue
          //每周周this.addPlanForm.weekValue
          if (week === "7") {
            week = "0"
          }
          while (currentDate <= endDate) {
            if (currentDate.getDay().toString() === week) {
              date_list.push(currentDate.toISOString().slice(0, 19).replace('T', ' '));
            }
            currentDate.setDate(currentDate.getDate() + 1);
          }
        }
        if (this.addPlanForm.valueRadio === 3 && this.addPlanForm.monthValue===undefined) {
          message.error("请填写每月具体日期")
          return
        }
        if (this.addPlanForm.valueRadio === 3) {
          //每月第this.addPlanForm.monthValue天

          while (currentDate <= endDate) {
            if (currentDate.getDate().toString() === this.addPlanForm.monthValue) {
              date_list.push(currentDate.toISOString().slice(0, 19).replace('T', ' '));
            }
            currentDate.setMonth(currentDate.getMonth() + 1);
          }
        }
        //插入
        for (const dateIt of date_list) {
          for (const deviceIt of this.addPlanForm.subDevices) {
            await saveDeviceInspectionPlan({
              'code':this.generateUniqueCode(),
              'device_id':deviceIt.device_id,
              'user_in_charge':this.addPlanForm.order_user_id,
              'inspection_time':dateIt,
              'status':0
            })
          }
        }
        this.handleCancel0()
        message.success("新增成功")
        await this.initialize()


    },
  },
  beforeDestroy() {
    if (this.axiosSource) {
      this.axiosSource.cancel('Request canceled due to page navigation.');
    }
  }
}
</script>

<style scoped lang="less">
.aPopover{
}
.aPopover:hover {
  background-color: #EA5413;
}


.dataBox{
  margin-top: 20px;
}

.hide-scrollbar::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}

::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.hide-scrollbar {
  -ms-overflow-style: none;  /* IE 和 Edge */
  scrollbar-width: none;  /* Firefox */
  overflow-y: scroll; /* 保持内容可滚动 */
}
.demo-infinite-container {
  margin-top: 0px;
  border: 1px solid #e8e8e8;
  border-radius: 4px;
  overflow: auto;
  padding: 8px 24px;
  height: 300px;
}
/deep/ .ant-form-inline .ant-form-item-with-help{
  margin-bottom: 0px;
}
/deep/ .ant-input[disabled]{
  pointer-events: none;
  color: #000000d9;
  background-color: #f5f5f5;
  cursor: not-allowed;
  opacity: 1;
}
/deep/ .unit .ant-select-selection--single{
  margin-left: 0px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 0;
}
/deep/ .ant-select-disabled .ant-select-selection {
  background-color: #fff;
}
/deep/ .ant-input[disabled]{
  pointer-events: none;
  color: #000000d9;
  background-color: #fff;
  cursor: not-allowed;
  opacity: 1;
}
/deep/ .ant-input-number-disabled{
  pointer-events: none;
  color: #000000d9;
  background-color: #fff;
  cursor: not-allowed;
  opacity: 1;
}
</style>